<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>OPPO注册页面</title>
		<link rel="stylesheet" type="text/css" href="static/css/register.css"/>
		<link rel="stylesheet" href="static/css/jigsaw.css">
		<script src="static/js/jigsaw.js"></script>
		<script type="text/javascript" src="static/js/jquery-1.12.4.js"></script>
		
  <style>
      #msg {
      width: 100%;
      line-height: 40px;
      font-size: 14px;
      text-align: center;
    }
 </style>
 
	</head>
	<body>
		<div class= "container">
			<div class ="guidecolumn">
				<ul>
					<li><a href="#">OPPO官网</a></li>
					<li><a href="#">OPPO社区</a></li>
					<li><a href="#">ColorOS</a></li>
				</ul>
			</div>
		<div class="main">
			<!--大框-->
			<div class="box" >
				<div class="text1">注册OPPO账号</div>
				<div class="login">
				<form action="ImproveDataControl" method = "post" enctype = "multipart/form-data">
					<!--手机号-->
					<div style ="margin-left:12px; height:35px"><input id = "user_img" class="row1_1" name="user_img" type="file" value="上传头像"> </div>
					
					<div class="row1" style="margin-top: 10px;">
						<input class="row1_1" name="user_name" type="text" id="phoneNum" placeholder="请输入用户名" >					
					</div>
					
					<div class="row1" style="margin-top: 10px;">
						<input class="row1_1" name= "user_psw" type="password" placeholder="请输入密码">					
					</div >
					
					<div class="row1" style="margin-top: 10px;">
						<input class="row1_1" name= "user_psw1" type="password" placeholder="请输入确认密码">					
					</div >
					
					<!--注册-->
					<div class="row1">
						<input id="regist_button" class="row1_2" type="submit" value="开始使用" style="margin-top: 22px;"/>
					</div>
				</form>
			    </div>
		    </div>
		   
		</div>
	</div>	
		   <script type="text/javascript">
			$(".row1_2").click(function(){
				//错误提示信息
				var strMsg = "";
				//验证用户名不能为空
				//获取用户名dom对象
				var $dom_name = $("[name='user_name']");//将dom对象转换为jQuery对象
				//通过value的属性获取控件的值
				var userName = $dom_name.val();
				if(userName==null||userName==""){
					//增加提示信息
					strMsg+="请输入用户名！\n";
					$("[name='user_name']").html("请输入用户名").css("background-color:","red");
				}
				//验证密码不能为空
				var $userPsw = $("[name =user_psw]").val();
				if($userPsw==null||$userPsw==""){
					//增加提示信息
					strMsg+="请输入密码！\n";
					$("[name='user_psw']").html("请输入密码").css("background-color:","red");
				}else{
					//验证两次输入的密码是否相同
					var $userPsw1 = $("[name =user_psw1]").val();
					if($userPsw1!=$userPsw){
						strMsg+="两次输入的密码不一致！\n";
						$("[name='user_psw1']").html("请输入密码").css("background-color:","red");
					}
				}
				//判断整个表单是否可以提交
				if(strMsg==""){
					window.location.href="index.html";
					//通过验证
					return  true;	
				}else{
					//验证不通过
					alert(strMsg);
					return false;
				}
			})
		</script>
		  	
	</body>
</html>
